{extend name="public:base" /}
{block name="header"}
<style>
    .tabinfo tr {height:37px; }
            .form input{
                width:300px;
                padding:5px;
            }
            .form input:focus{
                border:1px solid #ff0000;
            }
</style>
{/block}
{block name="main"}

<script type="text/javascript" src="/static/shop/js/address/worldAddress.js"></script>
<script type="text/javascript" src="/static/shop/js/address/TestAddress.js"></script>
<script type="text/javascript" src="/static/shop/js/address/TestChooseAddress.js"></script>
    <div class="ShareAnyContainer" style="font-size: 14px;">
        当前位置：<a href="{:url('shop/index/index')}" title="首页">首页</a>&nbsp;&nbsp;/&nbsp;&nbsp;<a
            href="{:url('shop/account/userinformation')}" title="新增收货地址">新增收货地址</a>
    </div>
    <div class="ShareAnySeparate"></div>
    <div class="ShareAnyContainer">
        <div class="line"></div>
    </div>
    <div class="ShareAnySeparate"></div>
    <div class="ShareAnyContainer">
      
        <table  width=100% border="0">
            <tr>
                <td valign="top" width="20%">{include file="public/account" /}</td>
                <td valign="top" width="5%">&nbsp;</td>
                <td valign="top" width="75%" style="line-height: 50px; text-align: center;" class="form">
                    <p style="text-align: left; font-size: 25px;">新增收货地址</p>
                    <TABLE class="tabinfo">
                    <TR>
						<TD align="left">
						<div class="ShareAnySeparate"><b>国家：</b>
							<select id="s1" onchange="getCountry()" style="width: 222px; height: 25px"><option>请选择国家</option></select>
						</div>
						 </td>
					</tr>
					<TR>
						<TD align="left">
						<div class="ShareAnySeparate"><b>省份：</b>
							<select id="s2" onchange="getProvince()" style="display: none"><option>省份、州</option></select>
							<select id="id_provSelect" name="provSelect" style="display: none;width: 222px; height: 25px" onChange="getChinaProv(this.value);">
								<option>请选择省份</option>
							</select>
						</div>
						 </td>
					</tr>
					<TR>
						<TD align="left">
							<div class="ShareAnySeparate"><b>地级市、县：</b>
								<select id="s3" style="display: none"><option>地级市、县</option></select>
								<select id="id_citySelect" name="citySelect"
										style="display: none;width: 222px; height: 25px" onChange="getChinaCity(this.value);"><option>请选择城市</option></select>
							</div>
						</td>
					</tr>

					<tr>
						<TD align="left">
							<div class="ShareAnySeparate">
								<b>收货人姓名：</b>
								<input type="text" id="name" value="" style="width: 222px; height: 18px">
								<small style="color:red;">(必填)</small>
							</div>

						</td>
					</tr>
					<tr>
						<TD align="left">
							<div class="ShareAnySeparate">
								<b>详细地址：</b>
								<input type="text" id="address1" value="" style="width: 222px; height: 18px">
								<small style="color:red;">(必填)</small>
							</div>

						</td>
					</tr>
					<tr>
						<TD align="left">
							<div class="ShareAnySeparate">
								<b>标志建筑：</b>
								<input type="text" id="address2" value="" style="width: 222px; height: 18px">
								<!--<small style="color:red;">(必填)</small>-->
							</div>

						</td>
					</tr>
					<tr>
						<TD align="left">
							<div class="ShareAnySeparate">
								<b>电子邮箱：</b>
								<input type="text" id="email" value="" style="width: 222px; height: 18px">
								<!--<small style="color:red;">(必填)</small>-->
							</div>

						</td>
					</tr>
					<tr>
						<TD align="left">
							<div class="ShareAnySeparate">
								<b>邮编：</b>
								<input type="text" id="postcode" value="" style="width: 222px; height: 18px">
								<!--<small style="color:red;">(必填)</small>-->
							</div>

						</td>
					</tr>
					<tr>
						<TD align="left">
							<div class="ShareAnySeparate">
								<b>手机号码：</b>
								<input type="text" id="mobile" value="" style="width: 222px; height: 18px">
								<small style="color:red;">(必填)</small>
							</div>
					
					 	</td>
					</tr>
						<tr>
							<TD align="left">
								<div class="ShareAnySeparate">
									<b>最佳送货时间：</b>
									<input type="text" id="sendtime" value="" style="width: 222px; height: 18px">
									<!--<small style="color:red;">(必填)</small>-->
								</div>

							</td>
						</tr>
					<TR height="50px"><TD>
					<div class="ShareAnySeparate">
                        <button id="submit" style="height:50px;width:150px;">保    存</button>
                        </div>
					</TD></TR>
					</TABLE>
                </td>
            </tr>
        </table>

		<input type="hidden" id="redirect" value="">
    </div>
{/block}
{block name="footer"}
    <script>
        $(document).ready(function () {
            $("#submit").on("click", function () {
                if($("#s1").val() =='中国'){
                    if($('#id_citySelect').find("option:selected").text() == '请选择城市'){
                        return alert('请选择城市');
                    }
                    if($('#id_citySelect').find("option:selected").text() == '地级市、县'){
                        return alert('请选择城市');
                    }
                    prov = $('#id_provSelect').find("option:selected").text();
                    city = $('#id_citySelect').find("option:selected").text();
				}else{
                    if($('#s3').find("option:selected").text() == '请选择城市'){
                        return alert('请选择城市');
                    }
                    if($('#s3').find("option:selected").text() == '地级市、县'){
                        return alert('请选择城市');
                    }
                    prov = $('#s2').find("option:selected").text();
                    city = $('#s3').find("option:selected").text();
				}
				if(!$("#name").val()){
                    return alert('请输入收货人姓名');
				}
                if(!$("#address1").val()){
                    return alert('请输入详细地址');
                }
                if(!$("#mobile").val()){
                    return alert('请输入收货人联系方式');
                }


				$.ajax({
                    url: "{:url('shop/account/ajaxaddress')}",
                    type: "POST",
                    dataType: "JSON",
                    data: {
                        country: $("#s1").val(),
                        prov:prov,
                        city:city,
                        name: $("#name").val(),
                        address1:$("#address1").val(),
                        address2:$("#address2").val(),
                        email:$("#email").val(),
                        postcode:$("#postcode").val(),
                        mobile:$("#mobile").val(),
                        sendtime:$("#sendtime").val(),
                    },
                    success: function (data) {
                        alert(data.msg);
                        if (data.code == "0") {
                            window.location.href = "{:url('shop/account/address')}";
                        }

                    }
                });
            });
        });
    </script>

<script type="text/javascript">
    var s = [ "s1", "s2", "s3" ];
    var opt0 = [ "国家", "省份、州", "地级市、县" ];
    function setup() {

        change(0);
    }
</script>
<script type="text/javascript">
    function loadProvince(regionId) {
        $("#id_provSelect").html("");
        $("#id_provSelect").append("<option value=''>请选择省份</option>");
        var jsonStr = getAddress(regionId, 0);
        for ( var k in jsonStr) {
            $("#id_provSelect").append(
                "<option value='"+k+"'>" + jsonStr[k] + "</option>");
        }
        if (regionId.length != 6) {
            $("#id_citySelect").html("");
            $("#id_citySelect").append("<option value=''>请选择城市</option>");
//            $("#id_areaSelect").html("");
//            $("#id_areaSelect").append("<option value=''>请选择区域</option>");
        } else {
            $("#id_provSelect").val(regionId.substring(0, 2) + "0000");

        }
    }

    function loadCity(regionId) {
        $("#id_citySelect").html("");
        $("#id_citySelect").append("<option value=''>请选择城市</option>");
        if (regionId.length != 6) {
//            $("#id_areaSelect").html("");
//            $("#id_areaSelect").append("<option value=''>请选择区域</option>");
        } else {
            var jsonStr = getAddress(regionId, 1);
            for ( var k in jsonStr) {
                $("#id_citySelect").append(
                    "<option value='"+k+"'>" + jsonStr[k] + "</option>");
            }
            if (regionId.substring(2, 6) == "0000") {
//                $("#id_areaSelect").html("");
//                $("#id_areaSelect").append("<option value=''>请选择区域</option>");
            } else {
                $("#id_citySelect").val(regionId.substring(0, 4) + "00");

            }
        }
    }

    function loadArea(regionId) {
//        $("#id_areaSelect").html("");
//        $("#id_areaSelect").append("<option value=''>请选择区域</option>");
        if (regionId.length == 6) {
            var jsonStr = getAddress(regionId, 2);
            for ( var k in jsonStr) {
//                $("#id_areaSelect").append(
//                    "<option value='"+k+"'>" + jsonStr[k] + "</option>");
            }
//            if (regionId.substring(4, 6) != "00") {
//                $("#id_areaSelect").val(regionId);
//            }
        }
    }
    function getCountry() {
        change(1);
        var country = document.getElementById("s1");
        var province = document.getElementById("s2");
        var city = document.getElementById("s3");
        var provSelect = document.getElementById("id_provSelect");
        var citySelect = document.getElementById("id_citySelect");
//        var areaSelect = document.getElementById("id_areaSelect");
        if (country.value == "中国") {
            loadProvince('440116');
            provSelect.style.display = "inline";
            province.style.display = "none";
            city.style.display = "none";
        } else {
            province.style.display = "inline";
            provSelect.style.display = "none";
            citySelect.style.display = "none";
//            areaSelect.style.display = "none";
        }
    }
    function getChinaProv(regionId) {
        document.getElementById("id_citySelect").style.display = "inline";
        loadCity(regionId);
    }
    function getChinaCity(regionId) {
//        document.getElementById("id_areaSelect").style.display = "inline";
//        loadArea(regionId);
    }
    function getProvince() {
        change(2);
        var province = document.getElementById("s2");
        var city = document.getElementById("s3");
        city.style.display = 'inline';
    }
    setup()
</script>
{/block}